<template>
    <div class="app-container">
      <el-table
        v-loading="listLoading"
        :data="list"
        element-loading-text="Loading"
        border
        fit
        highlight-current-row
      >
      <el-table-column align="center" label="ID" width="95">
        <template slot-scope="scope">
          {{ scope.row.id}}
        </template>
      </el-table-column>
      <el-table-column label="ID1">
        <template slot-scope="scope">
          {{ scope.row.parentId }}
        </template>
      </el-table-column>
      <el-table-column label="名称" width="110" align="center">
        <template slot-scope="scope">
          <span>{{ scope.row.name }}</span>
        </template>
      </el-table-column>
      <el-table-column label="title" width="110" align="center">
        <template slot-scope="scope">
         <span>{{scope.row.title}}</span>
        </template>
      </el-table-column>
        <el-table-column label="主键" width="110" align="center">
          <template slot-scope="scope">
            <span>{{scope.row.component}}</span>
          </template>
        </el-table-column>
      <el-table-column align="center"  label="leval" width="200">
        <template slot-scope="scope">

          <span>{{ scope.row.leval }}</span>
        </template>
      </el-table-column>
      <el-table-column label="图标" width="110" align="center">
        <template slot-scope="scope">
          {{ scope.row.icon }}
        </template>
      </el-table-column>
        <el-table-column label="hidden" width="110" align="center">
          <template slot-scope="scope">
            {{ scope.row.hidden }}
          </template>
        </el-table-column>
        <el-table-column label="type" width="110" align="center">
          <template slot-scope="scope">
            {{ scope.row.type }}
          </template>
        </el-table-column>
        <el-table-column label="状态" width="110" align="center">
          <template slot-scope="scope">
            {{ scope.row.status }}
          </template>
        </el-table-column>
        <el-table-column label="sort" width="110" align="center">
          <template slot-scope="scope">
            {{ scope.row.sort }}
          </template>
        </el-table-column>
        <el-table-column label="时间" width="110" align="center">
          <template slot-scope="scope">
            {{ scope.row.create_time|newDate }}
          </template>
        </el-table-column>
      </el-table>
    </div>
</template>

<script>
  import axios from 'axios'
    export default {
        name: "index",
      data(){
          return{
            list:[],
            listLoading:false
          }
      },created() {
          this.fetchDate()
      },methods:{
          fetchDate(){
          this.listLoading =true;
        axios.get('http://localhost:8080/OAManger_war_exploded/getMenuList').then(
          res=>{
            this.list =res.data
            this.listLoading=false
          }
        )
          }
      },
      filters:{
          newDate(){
            let d = new Date()
            return d.getFullYear()+"-"+d.getMonth()+"-"+d.getDate()
          }
      }
    }
</script>

<style scoped>

</style>
